nav {
  width: 100%;
}

nav .breadcrumb {
  background: none;
  width: 60%;
  margin: 0 auto;
  padding: 5px 16px;
  align-items: center;
}

nav .breadcrumb .breadcrumb-item > a {
  font-size: 12px;
  color: #666666;
}

nav .breadcrumb .breadcrumb-item > a:hover {
  text-decoration: none;
}

nav .breadcrumb .activity {
  font-size: 12px;
  color: #333333;
}

main {
  width: 800px;
  margin: 0 auto;
}

main section {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}

main section aside .tab-content {
  width: 400px;
  height: 400px;
}

main section aside .tab-content .tab-pane > img {
  width: 100%;
  height: 400px;
}

main section aside .piclist .nav-tabs {
  border-bottom: none;
}

main section aside .piclist .nav .nav-item .img-link {
  margin: 20px 20px 20px 0;
  width: 50px;
  height: 50px;
  display: block;
}

main section aside .piclist .nav .nav-item .img-link > img {
  width: 100%;
  height: 100%;
}

main section aside .piclist .nav .nav-item .active {
  border: 1px solid red;
}

main section article {
  margin-left: 50px;
}

main section article .details-title {
  font-size: 18px;
  color: #262626;
}

main section article .details-des {
  font-size: 10px;
  color: #666666;
  margin: 10px 0;
}

main section article .details-price {
  font-size: 20px;
  color: #c10000;
  border-bottom: 1px solid #dbdbdb;
  padding-bottom: 20px;
}

main section article .colorclass {
  margin: 0;
}

main section article .colorclass .classlist {
  display: flex;
  margin: 0;
}

main section article .colorclass .classlist .item {
  margin: 20px 20px 20px 0;
  width: 30px;
  height: 30px;
  list-style: none;
}

main section article .colorclass .classlist .item > a {
  display: block;
  width: 100%;
  height: 100%;
}

main section article .colorclass .classlist .item > a > img {
  width: 100%;
  height: 100%;
}

main section article .colorclass .classlist .item > a:focus {
  border: 1px solid red;
}

main section article > span {
  font-size: 10px;
  color: #262626;
}

main section article .btns {
  color: #262626;
  border-bottom: 1px solid #dbdbdb;
  padding: 10px 0;
}

main section article .btns > button {
  width: 30px;
  height: 30px;
  margin: 0 5px;
  border: 1px solid #dadada;
  background: #fff;
}

main section article .buyoradd {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}

main section article .buyoradd > button {
  width: 100px;
  height: 30px;
  border: none;
}

main section article .buyoradd > button > a {
  color: #fff;
  font-size: 12px;
}

main section article .buyoradd > button > a:hover {
  text-decoration: none;
}

main section article .buyoradd .buying {
  background: #c10000;
}

main section article .buyoradd .addcart {
  background: #fff;
  border: 1px solid #000;
}

main section article .buyoradd .addcart > a {
  color: #000;
}

main section .scn-left nav {
  border: none;
  border-top: 1px solid #dbdbdb;
  border-bottom: 1px solid #dbdbdb;
  margin-bottom: 30px;
}

main section .scn-left nav .nav-tabs {
  border-bottom: none;
}

main section .scn-left nav .nav-tabs .nav-link {
  padding: 8px 10px;
}

main section .scn-left nav .nav-tabs a {
  border-bottom: none;
  color: #000;
  font-size: 12px;
}

main section .scn-left nav .nav-tabs a:hover {
  border: 1px solid transparent;
  color: none;
}

main section .scn-left nav .nav-tabs .active {
  margin: 0;
  color: #db0000;
  border: 1px solid transparent;
  border-bottom: 1px solid #c10000;
}

main section .scn-left .tab-content .tab-pane {
  overflow: hidden;
  margin-top: 10px;
  width: 600px;
}

main section .scn-left .tab-content .tab-pane > img {
  width: 100%;
  margin-bottom: 10px;
}

main section .scn-left .tab-content .tab-pane .allevaluate-item {
  width: 100%;
  display: flex;
  border-bottom: 1px dotted #dbdbdb;
}

main section .scn-left .tab-content .tab-pane .allevaluate-item > i {
  display: block;
  width: 40px;
  height: 40px;
}

main section .scn-left .tab-content .tab-pane .allevaluate-item .describe {
  padding: 0 10px;
}

main section .scn-left .tab-content .tab-pane .allevaluate-item .describe > p {
  margin-bottom: 5px;
  font-size: 12px;
  color: #262626;
}

main section .scn-left .tab-content .tab-pane .allevaluate-item .describe .netname {
  margin-bottom: 20px;
}

main section .scn-left .tab-content .tab-pane .allevaluate-item .describe > span {
  font-size: 12px;
  color: #b0b0b0;
}

main section .scn-left .tab-content .tab-pane .allevaluate-item .describe .date {
  display: block;
  margin-bottom: 5px;
}

main section .scn-right {
  width: 150px;
  margin-top: 20px;
}

main section .scn-right a:hover {
  text-decoration: none;
}

main section .scn-right > button {
  width: 100%;
  height: 30px;
  margin-bottom: 10px;
  font-size: 12px;
  background: #f6f6f6;
  color: #333;
  border: none;
}

main section .scn-right .rec-item {
  width: 90%;
  margin: 0 auto;
}

main section .scn-right .rec-item > img {
  width: 100%;
}

main section .scn-right .rec-item > p {
  margin: 10px 0;
  font-size: 10px;
  color: #000;
}

main section .scn-right .rec-item > span {
  display: block;
  margin: 10px 0;
  font-size: 10px;
  color: #666666;
}

main .section > p {
  margin: 10px auto;
  text-align: center;
  font-size: 12px;
  color: #333;
}

main .section .carousel {
  width: 100%;
  margin-bottom: 20px;
}

main .section .carousel .carousel-inner {
  width: 80%;
  margin: 0 auto;
}

main .section .carousel .carousel-inner .carousel-item .imglist {
  display: flex;
  justify-content: space-between;
}

main .section .carousel .carousel-inner .carousel-item .imglist .item {
  width: 100px;
}

main .section .carousel .carousel-inner .carousel-item .imglist .item > img {
  width: 100%;
}

main .section .carousel .carousel-inner .carousel-item .imglist .item > p {
  font-size: 12px;
  color: #000;
  margin: 10px 0;
}

main .section .carousel .carousel-inner .carousel-item .imglist .item > span {
  font-size: 12px;
  color: #a10000;
}

main .section .carousel > button {
  background: transparent;
  border: 0;
}

main .section .carousel .carousel-control-prev {
  justify-content: flex-start;
  align-items: center;
}

main .section .carousel .carousel-control-next {
  justify-content: flex-end;
  align-items: center;
}

main .section .carousel .carousel-control-next .carousel-control-next-icon {
  color: #333;
}
